<template>
    <el-card class="box-card">
        <template #header>
            <div class="card-header">
                <span>数据结构</span>
                <!-- <el-button class="button" text>Operation button</el-button> -->
            </div>
        </template>
        <div class="form-item">
            <i>班级名称：</i>
            <el-input v-model="clazz.className" maxlength="10"  show-word-limit type="text" />
        </div>
        <el-divider />
        <div class="form-item">
            <i>课程暗号</i>
            <el-input  v-model="clazz.code" />
        </div>
        <el-divider />
    
        <div class="form-item">
            <i>课程简介:</i>
            <el-input
    v-model="clazz.introduce"
    autosize
    type="textarea"
    :placeholder="textarea"
    @input="changeIntroduce($event)"
  />
        </div>
        <el-divider />
    </el-card>
</template>

<script>
import http from '../api/course'
import { ElMessage } from 'element-plus'
export default {
    name: 'SettingsView',

    data() {
        return {
            props2: {
                multiple: true,
                checkStrictly: true,
            },
            clazz:{

            },
         
            //课程简介
            textarea:'暂无简介'
        };
    },

    mounted() {
       
        var studentId = localStorage.getItem("token");  
        http.queryClassByCourseIdAndstudentId(studentId).then((res)=>{

            if(res.code == 1){
        
                this.clazz=res.data;
                
            }
        })
        

    },

    methods: {
        // 修改表单内容
        changeIntroduce(e){
         
            http.updateClass().then((res)=>{

                if(res.code != 1){

                    ElMessage({
                        showClose: true,
                        message: '修改失败！',
                        type: 'error',
                    })
                    
                }
            
                })
        }
    },
    computed:{
       
    }
};
</script>

<style scoped>
.card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.text {
    font-size: 14px;
}

.item {
    margin-bottom: 18px;
}

.box-card {
    width: 480px;
}

.form-item i {
    display: block;
    font-size: 0.875rem;
    margin-bottom: 0.5rem;
}


.example-block {
    margin: 1rem;
}

.example-demonstration {
    margin: 1rem;
}
</style>